<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>

</head>

<body>
  <!-- 变量的生命周期 -->
  <!-- 第一步 在作用域里面先注册  第二步在是内存里面申请空间并存放默认值undefined 
  第三步就是赋值-->

  <script>

    /* var 允许重复申明一个已经定义的变量
     let  不允许重复申明一个已经定义的变量
     const 不允许重复申明一个已经定义的变量 申明的变量必须赋值*/
    //   let a=20
    //   console.log('a',a);
    //  const b=10
    //  console.log('b',b);
    // let  a=100
    // console.log('a',a);

    // let aa=200
    // console.log('a',a);


    /* let 和const 没有变量提升 var有变量提升*/
    // console.log(a);
    // var a=10

    // var a
    // console.log(a);
    // a=10

    // // 变量生命周期     造成暂时性死区
    // console.log(a);
    //  let a=10


    // var aa=100
    // let aa=100
    // console.log(window);


    // 块级作用域    全局作用域  函数作用域    块级作用域



    for (let i = 0; i < 10; i++) {
      console.log('i', i);
      var div = document.createElement('div');
      div.innerHTML = '我是一个div'
      document.body.appendChild(div)

      var divs=document.getElementsByTagName('div');
      console.log('i', Array.from(divs));
      // 异步任务
      divs[i].onclick = function () {
        console.log('i', i);
        divs[i].style.color = 'red'
      }
    }


    /*let 和const 只能在块级作用域内访问 一般指花括号内的作用域
   let 和const申明的变量不会绑定在window对象上 */

    if (true) {
      let a = 10
    }




  </script>
</body>

</html>